<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" href="../css/common/normalize.css" />
  <link rel="stylesheet" href="../css/common/reset.css" />
  <link rel="stylesheet" href="../css/journal.css" />
  <title>采矿家--采矿家日记</title>
</head>
<body>
  <div class="container">
    <!-- header -->
    <header class="header">
      <div class="icon-menu" v-show="!showMenu" @click="openMenu()">
        <img src="../images/icon_menu.png" alt="">
      </div>
      <div class="icon-close" v-show="showMenu" @click="closeMenu()">
          <img src="../images/icon_close.png" alt="">
        </div>
      <div class="icon-logo">
        <img src="../images/logo.jpg" alt="">
      </div>
      <div class="icon-user">
        <a href="login.html"><img src="../images/icon_user.png" alt=""></a>
      </div>
    </header>
    <!-- 菜单分类 -->
    <div class="menu" v-show="showMenu">
      <ul>
        <li><a href="index.html">首页</a></li>
        <li><a href="diamond.html">宝石</a></li>
        <li><a href="service.html">定制服务</a></li>
        <li><a href="purchasing.html">全球猎宝</a></li>
        <li class="active"><a href="journal.html">采矿家日记</a></li>
      </ul>
    </div>

    <!-- banner -->
    <div class="banner">
      <img src="../images/journal_banner.jpg" alt="">
    </div>
    <div class="category-list">
      <ul>
        <li class="all active">全部</li>
        <li>采矿家生活</li>
        <li>背后的故事</li>
        <li>珠宝知识</li>
        <li>企业文化</li>
      </ul>
    </div>
    <div class="journal-list">
      <ul>
        <li>
          <div class="title"><p>从蝴蝶翅膀看哥伦比亚祖母绿的魅力</p></div>
          <div class="content">
            <div class="left"><img src="../images/journal_img.jpg" alt=""></div>
            <div class="right">
              <p>12.23</p>
              <div></div>
              <span>珠宝知识</span>
            </div>
          </div>
        </li>
        <li>
          <div class="title"><p>从蝴蝶翅膀看哥伦比亚祖母绿的魅力</p></div>
          <div class="content">
            <div class="left"><img src="../images/journal_img.jpg" alt=""></div>
            <div class="right">
              <p>12.23</p>
              <div></div>
              <span>珠宝知识</span>
            </div>
          </div>
        </li>
        <li>
          <div class="title"><p>从蝴蝶翅膀看哥伦比亚祖母绿的魅力</p></div>
          <div class="content">
            <div class="left"><img src="../images/journal_img.jpg" alt=""></div>
            <div class="right">
              <p>12.23</p>
              <div></div>
              <span>珠宝知识</span>
            </div>
          </div>
        </li>
        <li>
          <div class="title"><p>从蝴蝶翅膀看哥伦比亚祖母绿的魅力</p></div>
          <div class="content">
            <div class="left"><img src="../images/journal_img.jpg" alt=""></div>
            <div class="right">
              <p>12.23</p>
              <div></div>
              <span>珠宝知识</span>
            </div>
          </div>
        </li>
      </ul>
    </div>

  </div>
</body>
<script src="../libs/rem.js"></script>
<script src="../libs/vue.1.0.8.js"></script>
<script src="../js/journal.js"></script>
</html>